<!DOCTYPE HTML>
<html>
<head>
<style>
div { border:1px solid green; margin:5px; }
div { overflow:auto; }
</style>
</head>
<body>
<div><span style="float:left">1<img src="square-outline-32x32.png">"Before beforeleft afterleft</span
>Inner<span style="float:left">2<img src="square-outline-32x32.png">After beforeleft afterleft"</span
></div>
<div><span style="float:left">1<img src="square-outline-32x32.png">"Before beforeleft afterright</span
>Inner<span style="float:right">2<img src="square-outline-32x32.png">After beforeleft afterright"</span
></div>
<div><span style="float:right">1<img src="square-outline-32x32.png">"Before beforeright afterleft</span
>Inner<span style="float:left">2<img src="square-outline-32x32.png">After beforeright afterleft"</span
></div>
<div><span style="float:right">1<img src="square-outline-32x32.png">"Before beforeright afterright</span
>Inner<span style="float:right">2<img src="square-outline-32x32.png">After beforeright afterright"</span
></div>
</body>
</html>
